<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      #info {
        width: 300px;
        height: 500px;
        background-color: #bfa;
        overflow: auto;
      }
    </style>
    <script>
      window.onload = function () {
        /**
         * 当垂直滚动条到底时表单项可用
         * onscroll
         *    该事件会在元素的滚动条滚动时触发
         */
        var info = document.getElementById("info");
        var inputs = document.getElementsByTagName("input");
        info.onscroll = function () {
          // 检查滚动条是否滚动到底
          if (info.scrollHeight - info.clientHeight - 1 <= info.scrollTop) {
            // 滚动条滚到底，使表单项可用

            /**
             * disdisabled 属性可以设置一个元素是否禁用
             */
            inputs[0].disabled = false;
            inputs[1].disabled = false;
          }
        };
      };
    </script>
  </head>
  <body>
    <h3>欢迎亲爱的用户注册</h3>
    <p id="info">
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
      亲爱的用户，请仔细阅读一下协议 亲爱的用户，请仔细阅读一下协议
    </p>
    <input type="checkbox" name="" id="" disabled="disabled" />我已仔细阅读
    <input type="submit" value="注册" disabled="disabled" />
  </body>
</html>
